<template>
	<view class="container">
		<!-- <navbar :title="handleType == 0 ? '添加地址':'编辑地址'"></navbar> -->
		<view class="wrap">
			<view class="address-item">
				<view class="label">收货人</view>
				<view class="input-con">
					<input type="text" @input='getValue' v-model="formObj.contact" placeholder-class="place" placeholder="收货人姓名" data-k='0'/>
				</view>
			</view>
			<view class="address-item">
				<view class="label">手机号码</view>
				<view class="input-con">
					<input type="text" @input='getValue' v-model="formObj.mobile" placeholder-class="place" placeholder="收货人手机号码" data-k='1' maxlength="11"/>
				</view>
			</view>
			<view class="address-item">
				<view class="label">所在地区</view>
				<view class="input-con">
					<biaofun-region :defaultValue="defaultValue" @change="onChangeRegion"></biaofun-region>
				</view>
			</view>
			<view class="address-item2">
				<view class="label">详细地址</view>
				<view class="input-con">
					<textarea disable-default-padding="true"  v-model="formObj.address" @input='getValue' placeholder-class="place" placeholder="小区楼栋/乡村名称" data-k='2'></textarea>
					<!-- <input type="text" /> -->
				</view>
			</view>
			<view class="default-wrap">
				<view class="label">
					<view>设置默认地址</view>
					<view class="tip">提醒:下单会优先使用该地址</view>
				</view>
				<switch :checked='formObj.is_default' style="transform:scale(0.6)" color="#FF2B4B" @change='switchEv'/>
			</view>
		</view>
		<view class="footer-fixed">
			<button class="new line_center" :disabled="isDisabled" :loading="isLoading" @tap='saveAddress' >{{btnText}}</button>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	import biaofunRegion from '@/components/biaofun-region/biaofun-region.vue';
	export default {
		components: {
			biaofunRegion,
		},
		data() {
			return {
				showPage:false,
				defaultValue: [],
				rightTip:'',
				handleType:0,
				isDisabled:false,
				isLoading:false,
				btnText:'保存',
				item:'',
				formObj: {
					contact: '',
					mobile: '',
					province: '北京市',
					city: '北京市',
					district: '东城区',
					address: '',
					is_default: false,
					ua_id: '',
					detail: ''
				},
			};
		},
		onLoad(option) {
			let title,rightTip;
			this.handleType = option.type;
			if( this.handleType == 0 ){
				uni.setNavigationBarTitle({
				     title: '新建地址'
				})
			}else{
				uni.setNavigationBarTitle({
				     title: '编辑地址'
				})
				// this.address_id = opt.id
				// this.address_detail()
			}
			
			
			if(option.item) this.item = JSON.parse(option.item);
			console.log('this.item',this.item)
			this.getAdData()
		},
		methods:{
			// 城市联动选择
			onChangeRegion(region) {
				console.log(region)
				this.formObj.province = region[0].name;
				this.formObj.city = region[1].name;
				this.formObj.district = region[2].name;
			},
			getValue(e) {
				let that = this,
					formObj = that.formObj,
					k = e.currentTarget.dataset.k,
					v = e.detail.value.replace(/\s*/g,"");
				switch (Number(k)) {
					case 0:
						formObj.contact = v;
						break;
					case 1:
						formObj.mobile = v;
						break;
					case 2:
						formObj.address = v;
						break;
				}
				that.formObj = formObj;
			
			},
			/* 设置默认 */
			switchEv(e) {
				this.formObj.is_default = e.detail.value;
				app.globalRequest({
					api: app.getApi().user.defaultAddress,
					method: "POST",
					data: {
						address_id: this.formObj.ua_id
					}
				}).then(res => {
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(err => {
				
				})
			},
			/* 取出默认数据 */
			getAdData(){
				// console.log(this.item,99)
				if( this.item != '' ){
					let formObj = this.formObj;
					formObj.contact = this.item.contact
					formObj.mobile = this.item.mobile
					formObj.province = this.item.province
					formObj.city = this.item.city
					formObj.district = this.item.district
					formObj.address = this.item.address
					formObj.is_default = this.item.is_default == 1 ? true : false;
					formObj.ua_id = this.item.address_id;
					this.defaultValue = this.item.detail.split('-');
					this.formObj = formObj;
				}
				
		
			},
			/* 保存 */
			saveAddress() {
				let that = this,
					formObj = that.formObj;
				if (!formObj.contact) {
					uni.showToast({
						title: '请填写收货人姓名',
						icon: 'none'
					})
				} else if (!formObj.mobile) {
					uni.showToast({
						title: '请填写手机号码',
						icon: 'none'
					})
				} else if(formObj.mobile.length != 11){
					uni.showToast({
						title: '请填写11位手机号码',
						icon: 'none'
					})
				}else if (!formObj.address) {
					uni.showToast({
						title: '请填写详细收货地址',
						icon: 'none'
					})
				} else {
					if( that.handleType == 0 ){
						that.addAddress()
					}else{
						that.editAddress()
					}
					
				}
			},
			/* 添加 */
			addAddress() {
				let that = this,
					formObj = that.formObj;
				that.isDisabled = true;
				that.isLoading = true;
				that.btnText = '添加中...';
				that.formObj.detail = that.formObj.province +'-'+ that.formObj.city+ '-' + that.formObj.district 
				app.globalRequest({
					api: app.getApi().user.handleAddress,
					method: 'POST',
					data: {
						contact: formObj.contact,
						mobile: formObj.mobile,
						detail: formObj.detail,
						// province: formObj.province,
						// city: formObj.city,
						// district: formObj.district,
						address: formObj.address,
						is_default: formObj.is_default ? 1 : 2,
						ua_id:formObj.ua_id
					},
				}).then(res=>{
					that.isDisabled = false;
					that.isLoading = false;
					that.btnText = '保存';
					if(res.code == 1){
						uni.showToast({
							title: '添加成功',
							icon: 'none'
						})
						setTimeout(()=>{
							uni.navigateBack({
								delta: 1
							})
						},1000)
						
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none',
							mask:true
						})
					}
				}).catch(err=>{
					
				})
				
			},
			// 编辑
			editAddress() {
				let that = this,
					formObj = that.formObj;
				that.isDisabled = true;
				that.isLoading = true;
				that.btnText = '修改中...';
				if( that.formObj.province ==  undefined ){
					that.formObj.detail = that.item.detail
				}else{
					that.formObj.detail = that.formObj.province +'-'+ that.formObj.city+ '-' + that.formObj.district 
				}

				app.globalRequest({
					api: app.getApi().user.editaddress,
					method: 'POST',
					data: {
						contact: formObj.contact,
						mobile: formObj.mobile,
						detail: formObj.detail,
						// province: formObj.province,
						// city: formObj.city,
						// district: formObj.district,
						address: formObj.address,
						is_default: formObj.is_default ? 1 : 2,
						address_id: formObj.ua_id
					},
				}).then(res=>{
					that.isDisabled = false;
					that.isLoading = false;
					that.btnText = '保存';
					if(res.code == 1){
						uni.showToast({
							title: '编辑成功',
							icon: 'none'
						})
						setTimeout(()=>{
							uni.navigateBack({
								delta: 1
							})
						},1000)
						
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none',
							mask:true
						})
					}
				}).catch(err=>{
					
				})
				
			},
		}
	}
</script>
<style lang="scss" scoped>
	.wrap{
		margin:24rpx 24rpx;
		background: #fff;
		border-radius: 16rpx;
	}
	.place{
		font-size: 28rpx;
		color:#C1C1C1;
	}
	.address-item{
		min-height: 80rpx;
		margin:0 30rpx;
		border-bottom: 2rpx solid #eee;
		display: flex;
		align-items: center;
		.label{
			width: 120rpx;
			margin-right: 38rpx;
			font-weight: bold;
		}
		.input-con{
			flex:1;
			height: 100%;
			input{
				width: 100%;
				height: 100%;
				font-size: 28rpx;
			}
			textarea{
				width: 100%;
				height: 160rpx;
				font-size: 28rpx;
			}
		}
	}
	.address-item2{
		height: 160rpx;
		margin:0 30rpx;
		border-bottom: 2rpx solid #eee;
		display: flex;
		padding:26rpx 0;
		box-sizing: border-box;
		.label{
			width: 120rpx;
			margin-right: 38rpx;
			font-weight: bold;
		}
		.input-con{
			flex:1;
			height: 100%;
			textarea{
				width: 100%;
				height: 100%;
				font-size: 28rpx;
			}
		}
	}
	.default-wrap{
		padding:30rpx 0;
		margin:0 30rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.label{
			font-weight: bold;
			.tip{
				font-weight: 400;
				font-size: 24rpx;
				color: #888888;
			}
		}
	}
	.footer-fixed{
		width:100%;
		height: 98rpx;
		background: $dis-con-color;
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		left:0;
		bottom:0;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		box-sizing: content-box;
		.new{
			width: 686rpx;
			height: 84rpx;
			background: $dis-liner-color;
			font-size: 28rpx;
			color:#fff;
			border-radius: 42rpx;
		}
	}
	
</style>